﻿@import 'Mixins.less';

fieldset
{
	margin: 0px 0px 1.5em;
}

legend
{
	font-size: 1.5em;
	font-weight: 100;
	margin: 0px;
	padding-bottom: 0.5em;
}

.form-horizontal, .form-vertical
{
	label
	{
		color: #555;
	}

	label:after
	{
		content: ":";
	}

	div.required > label:after
	{
		content: "*";
		color: red;
	}

	label.checkbox
	{
		width: auto;
		display: block;
	}

	label.checkbox:after
	{
		content: "";
	}

	label.checkbox-inline
	{
		width: auto;
		margin-right: 10px;
	}

	label.checkbox-inline:after
	{
		content: "";
	}

	> label.checkbox
	{
		margin-bottom: 10px;
	}	

	> div
	{
		margin-bottom: 10px;
		overflow: auto;
	}

	> div > label
	{
	}

	> div > div
	{
		overflow: auto;
	}

	input[type=text], input[type=password], select
	{
	}

	p
	{
		margin: 0.5em 0;
	}

	p:first-child
	{
		margin-top: 0px;
	}
}

.form-horizontal
{
	> div > label
	{
		float: left;
		display: block;
		margin-right: 1em;
		max-width: 200px;
	}
	
	> div.vertical > label
	{
		display: block;
		float: none;
		max-width: 3000px;
	}
}

.form-vertical
{
	> div > label
	{
		display: block;
	}
}

.form-buttons
{
	margin: 1em 0;
}

input[type=text], input[type=password], select
{
	.linear-gradient(#fff, #eeeeee, #ffffff);
	.border-radius(4px);
	border: solid 1px #aaa;
	color: #444;	
	padding: 0 0 0 8px;	
}

input[type=text], input[type=password]
{
	width: 300px;
	line-height: 1.5em;
}

select
{
	width: 310px;
}

input[type=checkbox]
{
	.linear-gradient(#fff, #eeeeee, #ffffff);
	.border-radius (2px);
	.bg-clip-padding();
	border: solid 1px #aaa;
	color: #444;
	overflow: visible;
}

input[type=text]:focus, input[type=password]:focus, select:focus, input[type=checkbox]:focus
{
	.shadow(0 0 5px rgba(0,0,0,.3));
	border: 1px solid #5897fb;
}

input[type=text]:disabled, input[type=password]:disabled, select:disabled, input[type=checkbox]:disabled
{
	border-color: #aaa;
	background-color: #ddd;
	color: #555;
}

input.error
{
	border: solid 1px red;
	background-color: #fcc;
}

input.wide, textarea.wide, select.wide
{
	width: 95% !important;
}

textarea
{
	width: 95%;
	font-family: Verdana, Helvetica, Sans-Serif;
	font-size: 0.8em;	
	.linear-gradient(#fff, #eeeeee, #ffffff);
	.border-radius (4px);
	.bg-clip-padding();
	border: solid 1px #aaa;
	color: #444;
	padding: 2px;
}

textarea:focus
{
	-webkit-box-shadow: 0 0 5px rgba(0,0,0,.3);
	-moz-box-shadow   : 0 0 5px rgba(0,0,0,.3);
	-o-box-shadow     : 0 0 5px rgba(0,0,0,.3);
	box-shadow        : 0 0 5px rgba(0,0,0,.3);
	border: 1px solid #5897fb;
}

textarea:disabled
{
	border-color: #aaa;
	background-color: #ddd;
	color: #555;
}

input[type=submit], input[type=button]
{
	line-height: 1.5em;
	vertical-align: middle;
	.border-radius(3px);
	.linear-gradient (#9e1217, #ed1d24, #9e1217);
	padding: 0 1em;
	outline: 0 none;
	border: 0 none;
	color: #fff;
}

input[type=submit]:hover, input[type=button]:hover
{
	.linear-gradient (#9e1217, #9e1217, #9e1217);
}

input[type=submit]:focus, input[type=button]:focus
{
	.shadow(0px 0px 8px #666);
}

input[type=submit]:active, input[type=button]:active
{
	.linear-gradient (#9e1217, #9e1217, #9e1217);	
	position: relative;
	top: 1px;
	left: 1px;
}

input[type=submit]:disabled,input[type=button]:disabled
{
	border-color: #aaa;
	color: #e0e0e0;
	.linear-gradient(#fefefe, #ffffff, #ffffff);
}

input.input-validation-error, textarea.input-validation-error, .ferror, input[type=text].ferror
{
	border: solid 1px #ff0000 !important;
}

span.field-validation-error
{
	color: #f00;
}

div.validation-summary-errors
{
	> ul
	{
		list-style: none;
		margin: 1em;
		padding: 1em 1em 0.5em;
		font-weight: bold;
		color: #ff0000;
		border: solid 1px #ff0000;
	}

	> ul > li
	{
		margin-bottom: 0.5em;
	}
}

.tabs
{
	@tab-border: #aaa;
	@tab-background: #ddd;
	@tab-background-hover: #bbb;
	@tab-background-active: #f7f7f7;
	@tab-padding-horizontal: 11px;
	@tab-padding-vertical: 7px;

	> ul
	{
		display: block;
		margin-bottom: 0px;
	
		li
		{
			display: inline-block;
			margin: 0px 3px 0px 0px;
		}

		li a
		{
			display: block;
			padding: @tab-padding-vertical @tab-padding-horizontal;
			background-color: @tab-background;
			border: solid 1px @tab-border;
		}
		
		li a:hover
		{
			background-color: @tab-background-hover;
		}
		
		li.selected a
		{
			cursor: default;
			color: Black;
			background-color: @tab-background-active;
			text-decoration: none;
			border-bottom: none;
			padding-bottom: @tab-padding-vertical + 1;
		}
	}

	> div
	{
		margin-top: -1px;
		padding: 10px;
		background-color: @tab-background-active;
		border: solid 1px @tab-border;
	}
}